<template>
  <div>
    <div class="home-new" data-v-23d30092="">
      <div class="home-panel" data-v-39dda62a="" data-v-23d30092="">
        <div class="container" data-v-39dda62a="">
          <div class="head" data-v-39dda62a="">
            <h3 data-v-39dda62a="">
              新鲜好物<small data-v-39dda62a="">新鲜出炉 品质靠谱</small>
            </h3>
            <a
              aria-current="page"
              href="#"
              class="router-link-active router-link-exact-active xtx-more"
              data-v-d6f2c104=""
              data-v-23d30092=""
              ><span data-v-d6f2c104="">查看全部</span
              ><i class="iconfont icon-angle-right" data-v-d6f2c104=""></i
            ></a>
          </div>
          <div data-v-23d30092="" style="position: relative; height: 426px">
            <ul class="goods-list" data-v-23d30092="">
              <li data-v-23d30092="" v-for="(item, index) in arr" :key="index">
                <a href="#" class="" data-v-23d30092=""
                  ><img :src="item.picture" alt="" data-v-23d30092="" />
                  <p class="name ellipsis" data-v-23d30092="">
                   {{item.name}}
                  </p>
                  <p class="price" data-v-23d30092="">¥{{item.price}}</p></a
                >
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      arr: [],
    };
  },
  mounted() {
    this.axios
      .get("https://apipc-xiaotuxian-front.itheima.net/home/new")
      .then((res) => {
        this.arr = res.data.result;
      });
  },
};
</script>
<style scoped>
</style>